<template>
	<view>
		<u-navbar title="协议列表"  :autoBack="true">
		</u-navbar>
		<view class="container">
			<view class="list" v-for="v,i in list" :key="i">
				<view class="item">
					<view class="left" @click="goSign(v,i)">
						<view class="title">
							{{v.title}}
						</view>
					</view>
					<view class="right " :class="{active:!v.is_signed}" @click="goSign(v,i)">
						{{v.is_signed?'已签署':'未签署'}}
					</view>
					<view class="active " v-if="v.is_signed" @click="goView(v,i)">
						查看
					</view>
		
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		agreementlist_api
	} from '@/api/second.js'
	export default {
		data() {
			return {
				list: [],
			}
		},
		onLoad() {

		},
		onShow() {
			this.getList()
		},
		methods: {
			goSign(item, i) {
				// if(item.is_signed) return
				uni.setStorageSync('agreementInfo', item)
				uni.navigateTo({
					url: `/pages/second/agreementDetails?file_no=${i+1}`
				})
			},
			goView(item, i) {
				uni.setStorageSync('agreementInfo', item)
				uni.navigateTo({
					url: `/pages/second/viewSign`
				})
			},
			getList(type = 0) {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				agreementlist_api().then(res => {
					this.list = Object.values(res.data)
				}).finally(() => {
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		margin: 40rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 12rpx 116rpx 0rpx rgba(196, 203, 214, 0.1036);
		border-radius: 48rpx 48rpx 48rpx 48rpx;
		opacity: 1;

		.list {
			padding: 20rpx 40rpx;

			&:first-child {
				padding-top: 40rpx;
			}

			&:last-child {
				padding-bottom: 40rpx;
			}

			.item {
				padding: 40rpx;
				background: #F4F9FD;
				border-radius: 48rpx 48rpx 48rpx 48rpx;
				opacity: 1;
				font-size: 28rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.right {
					font-size: 24rpx;
					color: #91929E;

					&.active {
						color: #7677EB;
					}
				}

				.title {
					min-width: 310rpx;
					font-weight: 700;
					color: #000000;
				}

				.content {
					font-weight: 400;
					color: #91929E;
					padding: 20rpx 0;
				}

				.time {
					font-size: 24rpx;
					color: rgba(145, 146, 158, 0.5);
				}
			}
		}
	}
</style>